<template>
	<view >
		
	
	<view class="loadBox" v-if='!contentShow'>
		<image src="https://jg.vjigong.com/uploads/loading.gif" mode="widthFix"></image>
		<view class="loadText">
			计算书生成中，请稍候...
		</view>
	</view>
	<view v-if='contentShow'>

		<!-- 工人信息 -->
		<view class="workerInfo_box">
			<view class="workerName">{{userInfo.name}}{{bookTotalData.projectText}}</view>
		</view>

		<!-- 间隔槽 -->
		<u-gap height="20" bg-color="#F5F5F5"></u-gap>

		
		<!-- 工资单表格 -->
		<view class="monthBox">
			<!-- 月份 -->
			<view class="calendarMonth_con">
				<view class="monthBtn" @click="daysPre">
					上一月
				</view>
				<view class="monthCon" @click="yearMonthClick">
					<text>{{currentYear}}-{{currentMonth}}</text>
				</view>
				<view class="monthBtn" @click="daysNext">
					下一月
				</view>
			</view>

			<!-- 选择年月弹窗 -->
			<u-popup v-model="yearMonthShow" mode="center" border-radius="20" safe-area-inset-bottom closeable safe-area-inset-bottom>
				<view class="yearMonth_box">
					<view class="yearMonth_head">
						<u-section title="选择年月" font-size="32" line-color="#327FE8" :right="false"></u-section>
					</view>
					<view class="yearList_con">
						<u-tabs :show-bar="false" active-color="#327FE8" :list="yearList" :current="yearIndex"
							height="100" font-size="32" @change="yearChange">
						</u-tabs>
					</view>
					<view class="monthList_con">
						<view class="monthItem" :class="monthIndex == index ? 'active':''"
							v-for="(item,index) in monthList" :key="index" @click="monthClick(index)">
							{{item.name}}
						</view>
					</view>
				</view>
			</u-popup>
			<view class="tableOutBox">
				<view class="tableInBox">
					<view class="tableTr">
						<view class="tableTd tableTd15">日期</view>
						<view class="tableTd tableTd15">上班</view>
						<view class="tableTd tableTd15">加班</view>
						<view class="tableTd tableTd15">借支</view>
						<view class="tableTd tableTd40">工地</view>
					</view>
					
					<view class="tableTr" v-for="(item,index) in dotList" v-if="item.is_yes==1">
						<view class="tableTd tableTd15">{{item.days}}</view>
						<view class="tableTd tableTd15 color1" @click="qpRecrdSelect(index)">
							{{item.record?item.record:'X'}}<text v-if="item.recordHour>0">({{item.recordHour}}H)</text>	
							<view class="qipao" :style="'top:'+(item.workList.length*-40-40)+'rpx;'" v-if='qpRecrdIndex==index && item.workList.length>0'>
								<view class="qpProject" v-for="(wItem,wIndex) in item.workList" :key="wIndex">
									{{wItem.project_name}} <text>{{wItem.num}}{{wItem.work_class_type==0?'工':'小时'}}</text>
								</view>
							</view>
						</view>
						<view class="tableTd  tableTd15 color2" @click="qpHourSelect(index)">
							{{item.overtime_hour?item.overtime_hour:'-'}}
							<view class="qipao" :style="'top:'+(item.workList.length*-40-40)+'rpx;'" v-if='qpHourIndex==index && item.workList.length>0 && item.overtime_hour>0'>
								<view class="qpProject" v-for="(wItem,wIndex) in item.workList" :key="wIndex">
									{{wItem.project_name}} <text>{{wItem.overtime_hour}}H</text>
								</view>
							</view>
						</view>
						<!-- 借支 -->
						<view class="tableTd  tableTd15 color1" @click="qpBorrowSelect(index)">
							{{item.borrow?item.borrow:'-'}}
							<view class="qipao" :style="'top:'+(item.accountList.length*-40-40)+'rpx;'" v-if='qpBorrowIndex==index && item.accountList.length>0 && item.overtime_hour>0'>
								<view class="qpProject" v-for="(wItem,wIndex) in item.accountList" :key="wIndex">
									{{wItem.project_name}} <text>{{wItem.cost}}元</text>
								</view>
							</view>
						</view>
						<view class="tableTd tableTd40" @click="qpProjectSelect(index)">
							<view class="textOver">
								<text  v-for="(wItem,wIndex) in item.workList" :key="wIndex">{{wItem.project_name}},</text>
							</view>
							<view class="qipao" :style="'top:'+(item.workList.length*-40-40)+'rpx;'" v-if='qpProjectIndex==index && item.workList.length>0'>
								<view class="qpProject" v-for="(wItem,wIndex) in item.workList" :key="wIndex">
									{{wItem.project_name}}
								</view>
							</view>
						</view>
					</view>
					
					<!-- <view class="tableTr">
						<view class="tableTd ">合计</view>
						<view class="tableTd  color1">{{dotList.monthData.month_num?dotList.monthData.month_num:'0'}}</view>
						<view class="tableTd   color2">{{dotList.monthData.overtime_hour?dotList.monthData.overtime_hour:'0'}}</view>
						<view class="tableTd ">{{dotList.monthData.month_borrow?dotList.monthData.month_borrow:'0'}}</view>
					</view> -->
				</view>
			</view>
		</view>


		<!-- 间隔槽 -->
		<u-gap height="20" bg-color="#F5F5F5"></u-gap>

		<!-- 工资计算 -->
		<view class="wageCalc_box" v-if="bookmonthData.length>0">
			<view class="calcHead_con">
				<view class="calcTit">工资计算书</view>
			</view>
			<view class="calcBody_con" v-for="(itemBook,indexBook) in bookmonthData" :key="indexBook">
				
				<view class="wageProject" >
					<u-section :title="itemBook.name" color="#327FE8" line-color="#327FE8" :right="false"></u-section>
				</view>
				
				
				<view class="wageModify" v-for="(item,index) in itemBook.bookMonth.salaryText" :key="index">
					<!-- <u-section :title="item" line-color="#327FE8" :right="false"></u-section> -->
					<view class="wageAbout">
						{{item}}
					</view>
					<view class="wageItemBox">
						<view class="wageModifyItem">
							<text>上班：</text>
							<text>{{itemBook.bookMonth.salaryCount[index]}}元</text>
						</view>
						<view class="wageModifyItem" v-if="itemBook.bookMonth.overSalaryCount[index]">
							<text>加班：</text>
							<text>{{itemBook.bookMonth.overSalaryCount[index]}}元</text>
						</view>
					</view>
					
				</view>

				
				<view class="wageTotal" v-if="itemBook.bookMonth.baoMoney>0">
					<text>包工：</text>
					<text>{{itemBook.bookMonth.baoMoney}}元</text>
				</view>
				<view class="wageTotal">
					<text>总工资：</text>
					<text>{{itemBook.bookMonth.moneyText}}元</text>
				</view>
				
				<view class="wageTotal">
					<text>剩余工资：</text>
					<text style="color: #327FE8;"
						@click="itemBook.bookMonth.noMoney>0?'':'toSetMoney'">{{itemBook.bookMonth.noMoney}}{{itemBook.bookMonth.noMoney>0?'元':''}}</text>
				</view>
			</view>
			
			
			<view class="totalBox">
				<!-- <view class="totalItem">
					<view class="totalItemLeft">
						合计工资
					</view>
					<view class="totalItemRight">
						<view class="tatalItemValue" v-for="(item,index) in bookTotalData.moneyText" :key="index">
							{{item.text}}
						</view>
					</view>
				</view> -->
				
				<view class="totalItem">
					<view class="totalItemLeft">
						剩余工资
					</view>
					<view class="totalItemRight">
						<view class="tatalItemValue" v-for="(item,index) in bookTotalData.noMoneyText" :key="index">
							{{item.text}}
						</view>
					</view>
				</view>
			</view>
		</view>

		
		
		<!-- #ifdef APP-PLUS -->
		<view class="handlePost_con ">
				<button @click="appShare" class="completeBtn workerBtn" v-if="signData.userAdminSign==1" >分享给带班</button>
				<button  @click="appShare" class="completeBtn workerBtn" v-if="signData.adminUserSign==1" >分享给工人</button>
		</view>
		<!-- #endif -->
		
		<!-- #ifdef MP-WEIXIN -->
		<view class="handlePost_con ">
				<button open-type="share" class="completeBtn workerBtn" v-if="signData.userAdminSign==1" >分享给带班</button>
				<button  open-type="share"  class="completeBtn workerBtn" v-if="signData.adminUserSign==1" >分享给工人</button>
		</view>
		<!-- #endif -->
		
		<view  style="width: 100%; height: 100rpx;"></view>
		

		<!-- 邀请签字弹窗 -->
		<u-popup v-model="signShow" mode="bottom" border-radius="20" safe-area-inset duration="0" closeable
			close-icon-size="40">
			<view class="signPop_con">
				<view class="signTit">
					邀请
					<template v-if="signRole=='2'">带班</template>
					<template v-if="signRole=='1'">工人</template>
					签字
				</view>
				<view class="signWarn">
					<u-icon name="error-circle" color="#FF4241" size="28"></u-icon>
					<text>分享给非账本成员，访问者仅可查看、评论、签字该笔账目！不会看到其他账目，更不会加入账本！</text>
				</view>
				<view class="signPost">
					<button class="signBtn" open-type="share" hover-class="none">
						<view class="signIcon">
							<image src="/static/signType1.png" mode=""></image>
						</view>
						<view class="signType">分享微信</view>
					</button>
					<view class="signBtn" @click="signClickDown">
						<view class="signIcon">
							<image src="/static/signType2.png" mode=""></image>
						</view>
						<view class="signType">线下签名</view>
					</view>
				</view>
			</view>
		</u-popup>

		<!-- 审核提示弹窗 -->
		<!-- 修改记工组件 -->
		<EditKeep ref="editKeep" :logIds="logId"></EditKeep>
		<Salary ref="salary" :workerIds="memberId" salaryBefore="0" overSalaryBefore="0"></Salary>
	</view>
	</view>
</template>

<script>
	import Calendar from "@/components/calendar/calendar.vue"
	import EditKeep from "@/components/wage/wageKedpEdit.vue"
	import Salary from "@/components/worker/salary.vue"
	export default {
		components: {
			Calendar,
			EditKeep,
			Salary
		},
		data() {
			return {
				// 默认工地信息
				defaultWorksite: JSON.parse(uni.getStorageSync('defaultWorksite')),
				yearList: JSON.parse(uni.getStorageSync('yearList')),
				monthList: JSON.parse(uni.getStorageSync('monthList')),
				yearIndex: 0,
				monthIndex: 0,
				/**
				 * 日历
				 */
				currentYear: '', // 年
				currentMonth: '', // 月
				currentDay: '', // 日
				weekMode: '', // 模式
				dotList: [], // 日历数据
				date: '', // 选择的日期

				// 用户信息
				userInfo: {},

				// 计算书
				bookmonthData: {
					dianTotal: 0,
					hourTotal: 0,
					baoNum: 0,
					moneyText: 0,
					borrowMoney: 0,
					noMoney: 0,
				},
				textList: [],

				workList: [],
				workTotal: 0,
				overList: [],
				overTotal: 0,
				baoList: [],
				baoTotal: 0,

				// 修改记工
				logId: 0,

				// 邀请带班签字弹窗
				signShow: false,
				signRole: '',

				// 审核提示
				checkShow: false,

				// 签名
				signatureForeman: {
					imgID: '',
					path: '',
					url: '',
				},
				signatureWorker: {
					imgID: '',
					path: '',
					url: '',
				},

				memberId: '',
				projectId: '',

				yearMonthShow: false,
				signData:{},
				overSalaryCount:[],
				salaryCount:[],
				
				isNext:1,
				qpRecrdIndex:-1,
				qpHourIndex:-1,
				qpBorrowIndex:-1,
				qpProjectIndex:-1,
				
				bookTotalData:{
					projectText:'',
				},
				
				contentShow:false,
			}
		},
		created() {
			this.date = this.$util.nowDate();
		},
		onLoad(option) {
			uni.showLoading({
				title: '数据生成中'
			});
			var _this = this;
			
			
			if (option.member_id) {
				_this.memberId = option.member_id;
				_this.projectId = option.project_id;
			} else {
				_this.memberId = _this.defaultWorksite.member_id;
				_this.projectId = _this.defaultWorksite.project_id;
			}
			
			
			if (option.currentyear) {
				_this.currentYear = option.currentyear;
				_this.currentMonth = option.currentmonth;
			}else{
				var date = new Date()
				_this.currentDate = date.getDate() // 今日日期 几号
				_this.currentYear = date.getFullYear() // 当前年份
				var currentMonth = date.getMonth() + 1 // 当前月份
				_this.currentMonth = currentMonth > 9 ? currentMonth : '0' + currentMonth; // 月份补0
			}
		},
		async onShow() {
			var _this = this;
			var token = uni.getStorageSync('token');
			if (!token) {
				await _this.$onLaunched;
			}
			_this.getWorkerDetail();
			_this.getDotList();
			_this.getBookMonth();
			
		
			// 获取签名
			uni.$on('signWorker', function(data) {
				console.log("==获取工人的签名==");
				console.log(data);
				var month = '';
				if (_this.currentYear) {
					month = _this.currentYear + '-' + _this.currentMonth;
				}
				_this.signatureWorker = data;
				_this.signDoing(month, _this.memberId, 'user', data.imgID);
				_this.getBookMonth();
			})
			uni.$on('signForeman', function(data) {
				console.log("==获取带班的签名1==");
				console.log(data);
				var month = '';
				if (_this.currentYear) {
					month = _this.currentYear + '-' + _this.currentMonth;
				}
				_this.signatureForeman = data;
				_this.signDoing(month, _this.memberId, 'boss', data.imgID);
				_this.getBookMonth();
			})
			
			
		},
		onReady() {
			// this.initDate();
			var _this=this;
			
			
			
		},
		onShareAppMessage(res) {
			var _this = this;
			var titType = '';
			if (_this.signRole == '1') {
				titType = '您的工人邀请您查看工资单';
			} else if (_this.signRole == '2') {
				titType = '您的带班邀请您查看工资单';
			}
			_this.addShareLog();

			return {
				title: titType,
				path: '/pages/wage/wageHome?member_id=' + _this.memberId + '&project_id=' + _this.projectId+'&signRole='+_this.signRole,
				imageUrl: '/static/sharePic.jpg',
			}
		},
		
		
		methods: {
			qpRecrdSelect(index){
				var _this=this;
				_this.qpRecrdIndex=index
				setTimeout(function(){
					_this.qpRecrdIndex=-1;
				},3000)
			},
			
			qpHourSelect(index){
				var _this=this;
				_this.qpHourIndex=index
				setTimeout(function(){
					_this.qpHourIndex=-1;
				},3000)
			},
			
			qpProjectSelect(index){
				var _this=this;
				_this.qpProjectIndex=index
				setTimeout(function(){
					_this.qpProjectIndex=-1;
				},3000)
			},
			
			qpBorrowSelect(index){
				var _this=this;
				_this.qpBorrowIndex=index
				setTimeout(function(){
					_this.qpBorrowIndex=-1;
				},3000)
			},
			//添加分享记录
			addShareLog(){
				var _this = this;
				_this.$u.post('/api/plus.report/addShareLog', {
					type: 'month',
				}).then(res => {
					
				}).catch(res => {
					console.log(res);
				})
			},
			
			// App分享为微信小程序（App中分享一个内容到微信好友，对方微信中呈现的是一个小程序卡片）
			appShare() {
				var _this = this;
				
				var titType='';
				if(_this.signRole == '1') {
					titType = '您的工人邀请您查看工资单';
				} else if (_this.signRole == '2') {
					titType = '您的带班邀请您查看工资单';
				}
				uni.share({
					provider: 'weixin',
					scene: "WXSceneSession",
					type: 5,
					imageUrl: '/static/sharePic.jpg',
					title: titType,
					miniProgram: {
						id: getApp().globalData.originalId,
						path: '/pages/wage/wageHome?member_id=' + _this.memberId + '&project_id=' + _this.projectId+'&signRole='+_this.signRole,
						type: 0,
						webUrl: this.app_url
					},
					success: res => {
						console.log(JSON.stringify(res));
					}
				});
			},
			
			// 工资设置
			toSetMoney() {
				var _this = this;
				uni.reLaunch({
					url: '/pages/index/index'
				})
			},

			//选择月份
			yearMonthClick() {
				this.yearMonthShow = true;
			},

			// 选择年
			yearChange(index) {
				var _this = this;
				_this.yearIndex = index;
				_this.monthIndex = '-1';
			},


			// 下一个
			daysNext() {
				var _this = this;
				if(_this.isNext==1){
					uni.showToast({
						title:'未到时间',
						icon:'error'
					})
					return
				}
				const d = new Date(_this.currentYear, _this.currentMonth, 1);
				_this.initDate(d);
			},
			// 上一个
			daysPre() {
				var _this = this;
				const d = new Date(_this.currentYear, _this.currentMonth - 2, 1);
				_this.initDate(d);
			},
			// 选择月
			monthClick(index) {

				var _this = this;
				_this.monthIndex = index;
				_this.yearMonthShow = false;

				var currentYear = parseInt(_this.yearList[_this.yearIndex].year);
				var currentMonth = parseInt(_this.monthList[_this.monthIndex].month);
				const d = new Date(currentYear, currentMonth - 1, 1);
				// 初始化日历
				_this.initDate(d);
			},
			//日期初始化
			initDate(cur) {
				var _this = this;
				let date = '';
				if (cur) {
					date = new Date(cur)
				} else {
					date = new Date()
				}
				
				
				_this.currentDate = date.getDate() // 今日日期 几号
				_this.currentYear = date.getFullYear() // 当前年份
				var currentMonth = date.getMonth() + 1 // 当前月份
				_this.currentMonth = currentMonth > 9 ? currentMonth : '0' + currentMonth; // 月份补0

				_this.getDotList();
				_this.getBookMonth();
			},

			// 邀请签字弹窗
			inviteSign(role) {
				this.signShow = true;
				this.signRole = role;
			},

			// 签名数据提交
			signDoing(month, member_id, role, imgs) {
				var _this = this;
				_this.$u.post('/api/project.salary/signDoing', {
					month: month,
					member_id: member_id,
					role: role,
					imgs: imgs,
				}).then(res => {
					_this.getDotList();
				}).catch(res => {
					console.log(res);
				})
			},

			// 获取工人详情
			getWorkerDetail() {
				var _this = this;
				_this.$u.get('/api/project.member/getDetail', {
					id: _this.memberId,
				}).then(res => {
					uni.hideLoading();
					console.log("==获取工人详情==");
					console.log(res);
					var workerDetail = res.data;
					_this.workerDetail = workerDetail;
					_this.userInfo = workerDetail.userInfo;
				}).catch(res => {
					console.log(res);
				})
			},

			// 账目日志
			accountClick() {
				var _this = this;
				var month = '';
				if (_this.currentYear) {
					month = _this.currentYear + '-' + _this.currentMonth;
				}
				uni.navigateTo({
					url: './accountList?month=' + month
				})
			},

			/**
			 * 日历 start
			 */
			// 获取日历组件的年
			getYear(value) {
				// console.log("获取日历组件的年：" + value)
				this.currentYear = value;
			},

			// 获取日历组件的月
			getMonth(value) {
				// console.log("获取日历组件的月：" + value)
				this.currentMonth = value;
			},

			// 获取日历组件的日
			getDay(value) {
				// console.log("获取日历组件的日：" + value)
				this.currentDay = value;
			},

			// 获取日历组件的模式
			getWeekMode(value) {
				// console.log("获取日历组件的模式：" + value)
				this.weekMode = value;
			},

			// 获取日历标记数据
			getDotList() {
				var _this = this;
				_this.contentShow=false;
				var month = '';
				if (_this.currentYear) {
					month = _this.currentYear + '-' + _this.currentMonth;
				}

				_this.$u.get('/api/project.monthdata/memberProjectMonthAll', {
					project_id: _this.projectId,
					month: month,
					member_id: _this.memberId,
				}).then(res => {
					uni.hideLoading();
					_this.dotList = res.data;
					_this.isNext=res.extend.isNext
					// _this.signatureWorker = {
					// 	imgID: res.data.monthData.user_img,
					// 	path: res.data.monthData.user_img_url,
					// 	url: res.data.monthData.user_img_url,
					// }

					// _this.signatureForeman = {
					// 	imgID: res.data.monthData.boss_img,
					// 	path: res.data.monthData.boss_img_url,
					// 	url: res.data.monthData.boss_img_url,
					// }

					
					
				}).catch(res => {
					console.log(res);
				})
			},

			// 日历选中日期事件回调
			dateChange(e) {
				// console.log(e);
				var _this = this;
				_this.date = e.fullDate;

				_this.getNoWorker();
				_this.noSelectAllStatus = false;
				_this.noSelectNum = 0;
				_this.getRecordList();
				_this.recordTabIndex = 1;
			},

			// 获取计算书
			getBookMonth() {
				var _this = this;
				var month = '';
				if (_this.currentYear) {
					month = _this.currentYear + '-' + _this.currentMonth;
				}

				_this.$u.get('/api/project.salary/bookMonthByProject', {
					project_id: _this.projectId,
					month: month,
					member_id: _this.memberId,
				}).then(res => {
					_this.contentShow=true;
					uni.hideLoading();
					_this.bookmonthData = res.data;
					_this.bookTotalData=res.extend
					// if(!res.data){
					// 	_this.textList=[];
					// 	_this.workList=[];
					// 	_this.workTotal=[];
					// 	_this.overList=[];
					// }
					// _this.textList = res.data.salaryText;

					// _this.workList = res.data.salaryWork;
					// _this.workTotal = res.data.salaryWork.length;
					// _this.overList = res.data.salaryOver;
					// _this.overTotal = res.data.salaryOver.length;
					// _this.baoList = res.data.salaryBao;
					// _this.baoTotal = res.data.salaryBao.length;
					// _this.signData=res.data.signData;
					
					// _this.overSalaryCount=res.data.overSalaryCount;
					// _this.salaryCount=res.data.salaryCount;
				}).catch(res => {
					console.log(res);
				})
			},

			// 修改记工
			recordEdit(id) {
				var _this = this;
				_this.logId = id
				_this.$refs.editKeep.clearData()
				_this.$refs.editKeep.editShow = true;
			},

			// 签名
			signClick(role) {
				uni.navigateTo({
					url: '/pages/signature/signature?role=' + role
				})
				this.signShow = false
			},
			
			// 签名
			signClickDown() {
				var _this=this;
				var role=1;
				role=_this.signRole
				uni.navigateTo({
					url: '/pages/signature/signature?role=' + role
				})
				this.signShow = false
			},

			// 撤销签字
			signDelete() {
				var _this = this;
				var month = '';
				if (_this.currentYear) {
					month = _this.currentYear + '-' + _this.currentMonth;
				}

				_this.$u.post('/api/project.salary/signDeleteMonth', {
					project_id: _this.projectId,
					month: month,
					member_id: _this.memberId,
				}).then(res => {
					uni.hideLoading();
					uni.showModal({
						title: '撤销',
						content: '双方签字均已撤销',
						showCancel: false,
						success() {
							_this.getDotList();
							_this.getWorkerDetail();
							_this.getBookMonth();
						}
					})
				}).catch(res => {
					console.log(res);
				})
			},

		},
	}
</script>

<style>
	page {
		background-color: #fff;
	}
</style>
<style lang="scss" scoped>
	// 工人信息
	.workerInfo_box {
		padding: 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.workerName {
		font-size: 32rpx;
		font-weight: bold;
	}

	.workerLog {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.workerLog text {
		font-size: 28rpx;
		color: $uni-color-text;
		margin-right: 10rpx;
	}

	.workerLog {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	// 工资计算
	.wageCalc_box {}

	.calcHead_con {
		padding: 30rpx;
		border-bottom: 2rpx solid #eee;
	}

	.calcTit {
		font-size: 32rpx;
		font-weight: bold;
	}

	.calcBody_con {
		padding: 30rpx 30rpx 0 30rpx;
		overflow: hidden;
		border-bottom: 20rpx solid #f2f2f2;
	}
	.wageProject{
		margin-bottom: 20rpx;
		line-height: 40rpx;
	}
	.wageModify {
		overflow: hidden;
		margin-bottom: 20rpx;
		line-height: 40rpx;
		background-color: #eaf5ff;
		padding: 20rpx;
		border-radius: 10rpx;
	}
	.wageModifyItemBox{
		overflow: hidden;
		color: #000;
	}
	.wageModifyItem{
		margin-top: 20rpx;
		width: 50%;
		float: left;
		
	}

	// 表格
	.wageTable {
		border: 2rpx solid #ccc;
		border-width: 2rpx 0 0 2rpx;
		text-align: center;
		overflow: hidden;
		margin-bottom: 30rpx;
	}

	.typeBox {
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.typeLeft {
		width: 130rpx;
		background: #f0f0f0;
		border: 2rpx solid #ccc;
		border-width: 0 2rpx 2rpx 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.typeRight {
		width: 560rpx;
	}

	.statsCon {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.statsLeft {
		width: 200rpx;
		border: 2rpx solid #ccc;
		border-width: 0 2rpx 2rpx 0;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.statsRight {
		width: 360rpx;
	}

	.num {
		width: 100%;
		height: 60rpx;
		line-height: 60rpx;
		border: 2rpx solid #ccc;
		border-width: 0 2rpx 2rpx 0;
		box-sizing: border-box;
	}

	.wageTotal {
		font-weight: bold;
		padding-bottom: 30rpx;
		border-bottom: 2rpx solid #eee;
		overflow: hidden;
		margin-bottom: 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	.wageTotal:last-child {
		margin-bottom: 0;
	}

	.signatureList_con {
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.signatureItem {
		width: 330rpx;
		text-align: center;
		overflow: hidden;
	}

	.signaturePic {
		width: 330rpx;
		height: 150rpx;
		background: #f0f0f0;
		border-radius: 10rpx;
		overflow: hidden;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.signaturePic .empty {
		font-size: 32rpx;
		color: #B3B3B3;
	}

	.signaturePic .pic {
		width: 150rpx;
		height: 330rpx;
		transform: rotate(-90deg);
	}

	.signatureType {
		font-size: 28rpx;
		font-weight: bold;
		margin-top: 20rpx;
	}

	// 底部
	.workerBtn {
		margin-right: 20rpx;
	}

	.workerBtn:last-child {
		margin-right: 0;
	}

	// 邀请带班签字弹窗
	.signPop_con {
		padding: 0 30rpx;
	}

	.signTit {
		padding: 40rpx 0;
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
		overflow: hidden;
	}

	.signWarn {
		display: flex;
	}

	.signWarn text {
		font-size: 24rpx;
		margin-left: 10rpx;
	}

	.signPost {
		padding: 60rpx 100rpx;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.signBtn {
		width: 120rpx;
		text-align: center;
	}

	.signIcon {
		width: 100%;
		text-align: center;
	}

	.signIcon image {
		width: 120rpx;
		height: 120rpx;
	}

	.signType {
		font-size: 28rpx;
		margin-top: 20rpx;
	}

	// 自定义材料弹窗
	.materialCustom_box {
		background-color: #fff;
	}

	.customTit {
		font-size: 36rpx;
		font-weight: bold;
		color: $uni-color;
		text-align: center;
		overflow: hidden;
		margin: 40rpx 0;
	}

	.customInput {
		padding: 0 30rpx 40rpx;
		overflow: hidden;
	}

	.customInput text {
		color: $uni-color-active;
	}

	.customInput input {
		width: 100%;
		height: 90rpx;
		line-height: 90rpx;
		padding: 20rpx;
		background: #f0f0f0;
		border-radius: 10rpx;
		box-sizing: border-box;
		overflow: hidden;
	}

	.monthBox {
		width: 690rpx;
		margin: 0 auto;
		padding: 30rpx 0;
	}


	//月份选择

	/* 月份 */
	.calendarMonth_con {
		height: 90rpx;
		padding: 0 0rpx;
		background: #f0f0f0;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 20rpx;
	}

	.monthBtn {
		font-size: 28rpx;
		color: $uni-color;
		height: 90rpx;
		line-height: 90rpx;
		width: 200rpx;
		text-align: center;
	}

	.monthCon {
		width: 340rpx;
		height: 0;
		color: $uni-color;
		border-bottom: 90rpx solid #fff;
		border-left: 15rpx solid transparent;
		border-right: 15rpx solid transparent;
		border-top-left-radius: 30rpx;
		border-top-right-radius: 30rpx;
		position: relative;
	}

	.monthCon text {
		font-size: 32rpx;
		font-weight: bold;
		text-align: center;
		position: absolute;
		left: 0;
		right: 0;
		top: 30rpx;
	}

	/**
	 * 选择年月弹窗
	 */
	.yearMonth_box {
		width: 690rpx;
	}

	.yearMonth_head {
		padding: 30rpx 30rpx 0;
	}

	.yearMonth_box .yearList_con {
		border-bottom: 1rpx solid #dcdcdc;
		overflow: hidden
	}

	.yearMonth_box .monthList_con {
		padding: 30rpx;
		overflow: hidden;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: center;
	}

	.yearMonth_box .monthItem {
		width: 160rpx;
		height: 80rpx;
		line-height: 80rpx;
		text-align: center;
		font-size: 28rpx;
		color: #333;
		// background: linear-gradient(0deg, #ffffff 0%, #ededed 100%);
		background-color: #F5F5F5;
		border-radius: 10rpx;
		// box-shadow: 1rpx 3rpx 5rpx 0 rgba(0, 0, 0, 0.16);
		margin-bottom: 30rpx;
	}

	.yearMonth_box .monthItem.active {
		color: $uni-color;
		background: uni-color-active;
	}
	
	
	
	//表格
	.tableOutBox{
		background-color: #dae1e8;
		border-left: 2rpx solid #e2e2e2;
		border-top: 2rpx solid #e2e2e2;
		box-sizing: border-box;
		width: 690rpx;
		margin: 0rpx auto;
		border-radius: 10rpx;
		overflow: hidden;
	}
	
	.tableInBox{
		background-color: #fff;
		border-radius: 10rpx;
	}
	.tableTr{
		height: 70rpx;
		line-height: 70rpx;
		// overflow: hidden;
		background-color: #f7fbfe;
		border-bottom: 2rpx solid #e2e2e2;
	}
	.tableTr2{
		min-height: 170rpx;
		line-height: 50rpx;
		text-align: left;
		font-size: 28rpx;
		font-weight: 400;
		box-sizing: border-box;
	}
	.tableTr:nth-child(2n){
		background-color: #ffff;
	}
	.tableTd{
		width: 25%;
		height: 100%;
		text-align: center;
		padding-left: 10rpx;
		float: left;
		font-size: 22rpx;
		font-weight: bold;
		border-right: 2rpx solid #e2e2e2;
		position: relative;
		
	}
	
	.textOver{
		overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;
		width: 100%;
		height: 100%;
	}
	.qipao{
		position: absolute;
		// top: -50rpx;
		left: 0;
		z-index: 999;
		background-color: rgba(0, 0, 0, 0.7);
		line-height: 40rpx;
		color: #fff;
		padding: 20rpx;
		width: 300rpx;
		border-radius: 20rpx 0 20rpx 0;
		text-align: left;
		font-size: 26rpx;
	}
	
	.qipaoBorrow{
		position: absolute;
		// top: -50rpx;
		right: 0;
		z-index: 999;
		background-color: rgba(0, 0, 0, 0.7);
		line-height: 40rpx;
		color: #fff;
		padding: 20rpx;
		width: 300rpx;
		border-radius:0 20rpx 0 20rpx ;
		text-align: left;
		font-size: 26rpx;
	}
	.qpProject text{
		padding-left: 10rpx;
	}
	.tableTd2{
		text-align: left;
		padding-left: 10rpx;
		font-weight: 400;
		font-size: 26rpx;
		color: #333;
	}
	.tableTd3{
		text-align: center;
		line-height: 170rpx;
		color: #327fe8;
		font-size: 26rpx;
		padding-left: 0rpx;
	}
	.color1{
		color: #ff6600;
	}
	.color2{
		color: #35c700;
	}
	
	.tableTd10{
		width: 10%;
	}
	.tableTd15{
		width: 15%;
	}
	.tableTd20{
		width: 20%;
	}
	.tableTd30{
		width: 30%;
	}
	.tableTd35{
		width: 35%;
	}
	.tableTd40{
		width: 40%;
	}
	.tableTd45{
		width: 45%;
	}
	.kongItem{
		width: 100%;
		height: 10rpx;
	}
	.ziOne{
		padding-left: 28rpx;
	}

	.handlePost_con{
		border-top: 0;
	}
	
	
	.totalItem{
		width: 100%;
		padding: 20rpx;
		overflow: hidden;
		border-bottom: 2rpx solid #eee;
	}
	.totalItemLeft{
		width: 120rpx;
		float: left;
	}
	.totalItemRight{
		float: right;
		text-align: right;
		width: 400rpx;
		line-height: 50rpx;
	}
	
	.loadBox{
		width: 100%;
		text-align: center;
	}
	.loadText{
		text-align: center;
		color: #000;
		font-size: 32rpx;
	}
</style>
